<template>
	<view style="height: 100%;width: 750rpx;background-color: #F5F5F8;">
		<view>
			<uni-search-bar @confirm="search" @input="input()" placeholder="名称搜索" :radius="100" clearButton="none" cancelButton="none" bgColor="#ffffff"></uni-search-bar>
		</view>
		<view v-for="(item,index) in list" :key="index">
			<view style="padding-bottom: 30rpx;width: 690rpx;margin-left: 30rpx;margin-top: 20rpx;background-color: #FFFFFF;border-radius: 12rpx;" @click="gotoXQ(item.name,item.id,i)">
				<view style="font-size: 36rpx;line-height: 36rpx;padding-top: 30rpx;margin-left: 30rpx;">{{item.name}}</view>
				<view style="font-size: 28rpx;line-height: 28rpx;color: #666666;margin-top: 20rpx;margin-left: 30rpx;">{{item.address}}</view>
				<view style="width: 108rpx;height: 36rpx;color: #FB9A17;background-color: rgba(251, 154, 23, 0.12);font-size: 24rpx;line-height: 36rpx;margin-top: 30rpx;margin-left: 30rpx;text-align: center;border-radius: 4rpx;" v-if="i==1">{{item.count}}处隐患</view>
				<view style="width: 108rpx;height: 36rpx;color: #E93B3D;background-color: rgba(255, 77, 79, 0.12);font-size: 24rpx;line-height: 36rpx;margin-top: 30rpx;margin-left: 30rpx;text-align: center;border-radius: 4rpx;" v-else-if="i==2">{{item.count}}处隐患</view>
				<view style="width: 174rpx;height: 36rpx;color: #75BC4D;background-color: rgba(117, 188, 77, 0.12);font-size: 24rpx;line-height: 36rpx;margin-top: 30rpx;margin-left: 30rpx;text-align: center;border-radius: 4rpx;" v-else>{{item.count}}处隐患已整改</view>
			</view>
		</view>	
		<image src="../../static/img_k@3x.png" style="width: 362rpx;height: 360rpx;margin-top: 190rpx;margin-left: 208rpx;" v-if="list.length === 0 && (isLoadMore=='noMore')"></image>
		<view v-else>
			<view v-show="isLoadMore" style="margin-bottom: 30rpx;">
				<uni-load-more :status="isLoadMore" :contentText="contentText" showText="false" @clickLoadMore="loadmore()"></uni-load-more>
			</view>
		</view>
		
		<image src="../../static/share_btn@3x.png" style="position: fixed;width: 154rpx;height: 154rpx;bottom: 40rpx;right: 20rpx;" @click="download()"></image>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list:[],
				i:'',
				statusList:'',
				page:1,
				isLoadMore:'more',
				contentText:{contentdown: "查看更多",contentrefresh: "正在加载...",contentnomore: "没有更多数据了"},
				areaId:'',
				dold:'',
				inputs:''
			}
		},
		methods: {
			download(){
				uni.showLoading({
					 title: '加载中'
				});
				this.$myRequest({
					url:'/project_flood/v1/check/risk/pdf',
					data:{"type":this.dold,"areaId":this.areaId}
				}).then((res)=>{
					console.log(res);
					uni.downloadFile({
				    url: res.data.data.url, 
				    success: response => {
				        if (response.statusCode === 200) {
				          uni.saveFile({
				            tempFilePath: response.tempFilePath,
				            success: (resData) => {
				              uni.openDocument({
				                filePath: resData.savedFilePath,
				                fileType: 'xls', // 指定文件的格式
				                showMenu: true, // 允许出现分享功能
				                success: r => {
				                  console.log(r)
								  uni.hideLoading();
				                },
				                fail: openError => {
				                  console.log('打开失败: ', openError)
				                }
				              })
				            },
				            fail: error => {
				              console.log('error: ', error)
				            }
				          })
				        }
				      }
				});
				})
				
			},
			gotoXQ(name,id,i){
				if(i==3){
					uni.navigateTo({
						url:`yinhuanYZG?name=${name}&ownerId=${id}&i=${i}`
					})
					
				}
				else if(i==1){
					uni.navigateTo({
						url:`totalXQ?name=${name}&ownerId=${id}&i=${i}`
					})
				}
				else{
					uni.navigateTo({
					url:`YHDxiangqing?name=${name}&ownerId=${id}&i=${i}`
				})
				}
				
			},
			async getName(){
				this.$myRequest({
					url:'/project_flood/v1/check/risk/owner/page',
					data:{areaId: this.areaId, pageNum: this.page, pageSize: 100,"statusList":this.statusList}
				}).then((res)=>{
					console.log(res);
					this.list=res.data.data.list
					console.log(this.list);
					if(this.list.length<res.data.data.total)
						{
							this.isLoadMore='more'
						}
					else
						{
							this.isLoadMore='noMore'
							
						}
				})
			},
			loadmore(){
				if(this.isLoadMore !== 'more') return
				this.page=this.page+1
				this.$myRequest({
					url: '/project_flood/v1/check/risk/owner/page',
					data: {"areaId":this.areaId,"pageNum":this.page,"pageSize":100,"name":this.inputs,"statusList":this.statusList},
				}).then((res)=>{
					console.log(res);
					this.list=this.list.concat(res.data.data.list)
					if(this.list.length<res.data.data.total)
						{
							this.isLoadMore='more'
						}
					else
						{
							this.isLoadMore='noMore'
						}
				})
			},
			search(res){
				console.log(res);
				this.$myRequest({
					url: '/project_flood/v1/check/risk/owner/page',
					data: {"areaId":this.areaId,"pageNum":this.page,"pageSize":100,"name":this.inputs,"statusList":this.statusList},
				}).then((res)=>{
					console.log(res);
					this.list=res.data.data.list
				})
			},
			input(res){
				console.log(res);
				this.inputs=res
			},
		},
		onLoad(options) {
			if(options.areaId!=undefined){
				this.areaId=options.areaId
			}else{
				try {
			    
				const A = uni.getStorageSync('areaId');
				console.log(this.areaId);
				this.areaId=A;
			    if (A) {
			        // console.log(X);
			    }
				
			} catch (e) {
			    // error
			}
			}
			
			console.log(options);
			this.i=options.i
			this.dold=options.dold
			if(this.i==1){
				uni.setNavigationBarTitle({
					title:'累计发现隐患场所列表'
				});
				this.statusList=[1,2,3]
			}
			else if(this.i==2){
				uni.setNavigationBarTitle({
					title:'现存隐患场所列表'
				});
				this.statusList=[1,2]
			}
			else{
				uni.setNavigationBarTitle({
					title:'已整改隐患场所列表'
				});
				this.statusList=[3]
			}
			
			
		},
		onShow() {
			uni.showLoading({
			    title: '加载中'
			});
			this.getName().then((res)=>{
				uni.hideLoading();
			})
		}
		
	}
</script>

<style>
page{background-color: #F5F5F8;}
</style>
